<template>
  <el-button type="primary" @click="showQRCode" :disabled="connect">
    {{ connect ? '已绑定企业预警通账号' : '绑定/刷新企业预警通账号' }}
  </el-button>

  <div class="qrcode" v-if="uuid">
    请扫描企业预警通账号二维码
    <img :src="qrcode" height="150px" />
    <h1>{{ isScanned }}</h1>
  </div>
  <div class="qinfo" v-else>
    <el-form label-width="180px">
      <el-form-item label="企业预警通绑定手机号：">
        <el-input
          disabled
          style="width: 400px"
          v-model="QStore.qUserPhone"
        ></el-input>
      </el-form-item>
      <el-form-item label="企业预警通昵称">
        <el-input
          disabled
          style="width: 400px"
          v-model="QStore.qUserNickname"
        ></el-input>
      </el-form-item>
    </el-form>
  </div>
</template>
<script setup lang="ts">
import { reqQyyjtUUID, reqRefreshToken } from '@/api/qyyjt'
import useQStore from '@/store/modules/qyyjt'
import useUserStore from '@/store/modules/user'
import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
let uuid = ref()
// let qUserInfo = ref({
//   qUserPhone :'',
//   qUserNickname : '',
// })
let isScanned = ref()
let timer = null
let connect = ref(false)
let QStore = useQStore()
let UserStore = useUserStore()
QStore.qUserNickname = UserStore.userObj.qUserNickname
QStore.qUserPhone = UserStore.userObj.qUserPhone

const showQRCode = async () => {
  let resp = await reqQyyjtUUID()
  uuid.value = resp.data.data
  // 点击开启轮询
  timer = setInterval(async () => {
    let resp = await QStore.getQUerInfo(uuid.value)
    if (resp.status === 113) {
      isScanned.value = '已成功登录'
      // qUserInfo.value.qUserPhone = resp.basic_info.phone
      // qUserInfo.value.qUserNickname = resp.basic_info.nickname
      // token.value = resp.data.data.token
      // basic_info.value = resp.data.data.basic_info
      uuid.value = ''
      // 登录成功以后清除掉timer
      clearInterval(timer)
      connect.value = true
    } else if (resp.status === 112) {
      isScanned.value = '扫码成功，请在手机端确认登录'
    } else {
      isScanned.value = '等待扫描中'
    }
  }, 3000)
}

let qrcode = computed(
  () =>
    'https://api.qrtool.cn/?text=https://cdn.finchina.com/app/h5/app_scan_no_installs/install.html?uuid=' +
    uuid.value,
)

onMounted(async () => {
  let result = await UserStore.verfyQToken()
  console.log(result)
  if (result === 'success') {
    connect.value = true
  }
  // let resp = await reqQyyjtUUID()
  // uuid.value = resp.data.data
  // console.log(qrcode.value)
})
// watch(uuid, () => {
//   timer
// })

// watch(qUserInfo, () => {
//   console.log(QStore.EncUser);
//   // timer = null
// })
onBeforeUnmount(() => {
  clearInterval(timer)
  // timer = null
})
</script>
<style scoped lang="scss">
.qinfo {
  margin-top: 30px;
}
</style>
